<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>MOGUTARO Eats Files!</title>
	<meta name="viewport" content="width=device-width,initial-scale=1">

	<link rel="shortcut icon" type="image/ico" href="images/favicon.ico">
	<meta name="msapplication-task" content="MOGUTARO Eats Files!">
	<meta property="og:image" content="images/screenshot_small.png"/>
	<meta property="og:title" content="MOGUTARO eats files! (for IE10 Test Drive)"/>
	<meta name="description" content="This is an example using HTML5 File API. MOGUTARO can eat the image/video/audio/text files.">

	<link rel="stylesheet" href="css/ReturnAndShareControls.css">
	<link rel="stylesheet" href="css/style.css">
	<script src="lib/js/modernizr-2.0.6.min.js"></script>
</head>
<body>
	<header id="siteHeader">
		<h1><img src="images/logo.png" id="logo" alt="MOGUTARO eats files!"></h1>
	</header>

<div id="container">
	<audio id="audioPlayer"></audio>
    <div id="sky">
		<div id="cloud_slow"></div>
		<div id="cloud_fast"></div>
		<div id="birds"></div>
	</div>
	<div class="rainbow">
		<canvas class="rainbow_color" width="1500" height="1500"></canvas>
		<canvas class="rainbow_color" width="1500" height="1500"></canvas>
		<canvas class="rainbow_color" width="1500" height="1500"></canvas>
		<canvas class="rainbow_color" width="1500" height="1500"></canvas>
		<canvas class="rainbow_color" width="1500" height="1500"></canvas>
	</div>
	<div id="whaleWrapper">
		<div id="island">
			<video id="tv" width='80'></video>
		</div>
		<div id="wordsBalloon"></div>
		<div id="colorsBalloon">
			<div class="colorsBalloonContents">
				<!--Top 5 used colors are ...-->
				<canvas id="pict" width="300" height="150"></canvas>
				<ul id="usedColors"></ul>
			</div>
		</div>
		<div id="whale">
			<div id="finTail"></div>
			<div id="whaleBody"></div>
			<!-- <div id="whaleStop"></div> -->
			<div id="mogumogu"></div>
			<div id="mogumogu_txt"></div>
			<div id="error"></div>
			<div id="error_txt"></div>
			<div id="finRight"></div>
			<div id="finLeft"></div>
			<div id="finMusic"></div>
			<div id="note"></div>
			<div id="mouthOfWhale" dropzone></div>	
		</div>
		<div id="whaleMovie">
			<div id="stopTxt"></div>
			<div id="stopImg"></div>
			<div id="whaleMovieStop"></div>
			<div id="whaleSideways"></div>
			<div id="finRemote">
				<div id="moviePlay"></div>
				<div id="movieStop"></div>
			</div>
		</div>
		<div id="hammer"></div>
		<div id="hammerMovie"></div>
	</div>
	<div id="sea">
		<div id="waveBack"></div>
		<div id="waveFront"></div>
	</div>
</div> <!--! end of #container -->

<div id="veil"></div>
<div id="aboutThisExample"></div>
<section id="descriptionOfThisExample">
	<h1></h1>
	<img id="closeDescriptionButton" src="images/close_button.png">
	<div class="content">
	</div>
</section>
<div id="ReturnAndShareControls"></div>
<script src="js/ReturnAndShareControls.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js"></script>
<script>window.jQuery || document.write('<script src="lib/js/jquery-1.7.1.min.js"><\/script>')</script>
<script src="lib/js/jquery.i18n.properties-min-1.0.9.js"></script>
<script src="lib/js/easel-0.4.js"></script>
<script src="lib/js/modernizr-2.0.6.min.js"></script>
<script src="lib/js/tweenjs/Tween.js"></script>
<script src="lib/js/tweenjs/Ease.js"></script>
<script src="lib/js/tweenjs/Timeline.js"></script>
<script src="lib/js/tweenjs/CSSPlugin.js"></script>
<script src="js/common.js"></script>
<script src="js/index.html.js"></script>

<script>
	var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]; // Change UA-XXXXX-X to be your site's ID
	(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1;
	g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
	s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
</body>
</html>
